<!--
 * @Author: Shber
 * @Date: 2024-07-11 18:03:40
 * @LastEditors: Shber
 * @LastEditTime: 2024-07-11 18:27:54
 * @Description: 
-->
<template>
  <tm-slide-switch @click="cellClick" :rightMenu="action" :width="686" :height="height">
    <view class="slide_switch">
      <view>
        <text class="sku_name">规格1</text>
        <view class="sku_desc mt_5">
          <text>价格：¥555</text>
          <text>库存：222</text>
        </view>
      </view>
      <tm-icon color="#C1C1C1" :font-size="32" name="tmicon-edit"></tm-icon>

    </view>
    <template v-slot:right>
      <view class="flex flex-row flex-row-center-end">
        <tm-sheet
          _class="flex flex-row flex-row-center-center"
          :width="w"
          :height="height"
          color="#FFBB00"
          no-level
          :margin="[0]"
          :padding="[0]"
        >
          <tm-text style="color: #fff;" :userInteractionEnabled="false" label="去重"></tm-text>
        </tm-sheet>
        <tm-sheet
          _class="flex flex-row flex-row-center-center"
          :width="w"
          :height="height"
          color="#E24F00"
          no-level
          :margin="[0]"
          :padding="[0]"
        >
          <tm-text :userInteractionEnabled="false" label="删除"></tm-text>
        </tm-sheet>
      </view>
    </template>
  </tm-slide-switch>
</template>
<script setup>
import { ref, reactive } from 'vue'

const w = 110
const height = 140
const h = height + 20
const isopen = ref(false)
const action = ref([
	{ text: '操作', color: 'black' },
	{ text: '删除按钮', color: 'green', icon: 'tmicon-delete' }
])
setTimeout(() => {
	isopen.value = true
}, 1000)
function onclick() {
	isopen.value = false
	console.log(6)
}
function cellClick() {
	uni.showToast({
		title: `点击了内容区域`,
		icon:'none'
	})
}
</script>

<style scoped lang="scss">
.slide_switch{display: flex; height: 70px; align-items: center; justify-content: space-between; padding-right: 16px;}
.sku_name{font-size: 15px; color: #333333;}
.sku_desc{font-size: 12px; color: #666666;}
</style>